<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        .box{width:200px;height:100px;border: solid 1px black;}
    </style>
</head>
<body>
    <div class="box"></div>
</body>
<script>

    // var box = document.querySelector(".box");
    
    document.onkeydown = function(eve){
        var e = eve || window.event;
        // console.log(e.keyCode);
        // console.log(e.which);
        var code = e.keyCode || e.which;
        // console.log(code);

        // a~z：65~90
        // 回车：13
        // 空格：32
        // 退格：8
        // f5：
        // f12：
        // 方向键：左37，上38，右39，下40

        // 功能键：ctrl，shift，alt，meta(win)
        // win：ctrl，MAC：control
        // console.log(e.ctrlKey);
        // win：shift，MAC：shift
        // console.log(e.shiftKey);
        // win：alt，MAC：option
        // console.log(e.altKey);
        // win：win(窗口)，MAC：command
        // console.log(e.metaKey);

        // if( e.ctrlKey && code === 65){
        //     console.log("ctrl + a");
        // }
    }
    
</script>
</html>